<!--党员组织关系转入-->
<template>
  <roll-in-layout :current="1">
    <div class="form-list">
      <div class="form-list-item">
        <span class="label">档案号：</span>
        <span class="content">{{form.archiveCode}}</span>
      </div>
      <div class="form-list-item">
        <span class="label">姓名：</span>
        <span class="content">{{form.personName}}</span>
      </div>
      <div class="form-list-item">
        <span class="label">党员编号（身份证号）：</span>
        <span class="content">{{form.personCard}}</span>
      </div>
    </div>
    <div class="form">
      <yd-cell-group>
        <yd-cell-item>
          <span slot="left" class="label required">请填写密码：</span>
          <xf-input
            slot="right"
            :valid="[{required: true, msg: '请填写密码'}]"
            v-model="form.password"
            ref="password"
            type="password"
            placeholder="请填写密码"></xf-input>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">重复密码：</span>
          <xf-input
            slot="right"
            v-model="form.repassword"
            type="password"
            :show-icon="false"
            placeholder="请再次输入密码"></xf-input>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">转入时间：</span>
          <xf-date-picker
            slot="right"
            :valid="[{required: true, msg: '请选择转入时间'}]"
            v-model="form.todate"
            ref="todate"
            placeholder="请选择转入时间"></xf-date-picker>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">性别：</span>
          <xf-picker
            slot="right"
            :valid="[{required: true, msg: '请选择性别'}]"
            v-model="form.personSex"
            ref="personSex"
            :list="sex"
            placeholder="请选择性别"></xf-picker>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">民族：</span>
          <xf-picker
            slot="right"
            :valid="[{required: true, msg: '请选择民族'}]"
            v-model="form.nationId"
            ref="nationId"
            :list="nation"
            placeholder="请选择民族"></xf-picker>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">政治面貌：</span>
          <xf-picker
            slot="right"
            :valid="[{required: true, msg: '请选择政治面貌'}]"
            v-model="form.aac024"
            ref="aac024"
            :list="affil"
            placeholder="请选择政治面貌"></xf-picker>
        </yd-cell-item>
      </yd-cell-group>
      <div class="next">
        <div class="next">
          <mt-button size="large" type="primary" @click="onSubmit">下一步</mt-button>
        </div>
      </div>
    </div>
  </roll-in-layout>
</template>
<script>
  import RollInLayout from './layout.vue'
  import XfInput from '../../../components/xf-input/xf-input.vue'
  import XfDatePicker from '../../../components/xf-date-picker/xf-date-picker.vue'
  import {STORAGE_TYPE} from '../../../common/js/config'
  import {validate, parse, echo, delNull} from '../../../common/js/util'
  import {getDics, dics, sexDic, affilDic} from '../../../common/js/dictionaries'
  import {mapGetters} from 'vuex'
  import XfPicker from '../../../components/xf-picker/xf-picker'

  export default {
    components: {
      XfPicker,
      XfDatePicker,
      XfInput,
      RollInLayout},
    computed: {
      ...mapGetters([
        'userInfo'
      ])
    },
    data() {
      return {
        form: {
          archiveCode: '', // 档案编号
          personName: '', // 姓名
          personCard: '', // 党员编号(身份证号)
          password: '', // 密码
          repassword: '',
          todate: '', // 转入时间
          personSex: '', // 性别
          nationId: '', // 民族
          aac024: '' // 政治面貌
        },
        affil: affilDic,
        sex: sexDic,
        nation: [],
        canLeave: false
      }
    },
    methods: {
      getDics() {
        getDics(dics.nation).then(res => {
          this.nation = res[0]
        })
      },
      onSubmit() {
        validate.bind(this)(this.form).then(() => {
          if (this.form.password !== this.form.repassword) {
            this.$message.toast('两次密码输入不一致')
            return
          }
          sessionStorage.setItem(STORAGE_TYPE.rollIn, JSON.stringify(Object.assign(this.temp, this.form)))
          this.canLeave = true
          this.$router.replace({name: 'rollIn2'})
        })
      },
      getBaseInfo() {
        this.$post('/admin/person/sapi/party/activity/getUser/baseInfo').then(res => {
          this.form.archiveCode = res.data.archiveCode
          this.form.personName = res.data.personName
          this.form.personCard = res.data.personCard
        })
      },
      getStatus() {
        this.$post('/admin/person/sapi/party/organization/get/audit/status', {}, loading => { this.$message.loading(loading) }, false).then(res => {
          // res.data.auditstate === 1 时，不可修改
          if (Number(res.data.auditstate) === 1) {
            this.$message.alert('党员信息已存在，无需重复录入').then(() => {
              // this.canLeave = true
              // this.$router.back()
            })
          } else {
            delNull(res.data)
            this.temp = res.data
            this.temp.repassword = this.temp.password
            sessionStorage.setItem(STORAGE_TYPE.rollIn, JSON.stringify(this.temp))
            echo(this.form, this.temp)
          }
        })
      }
    },
    created() {
      this.temp = parse(sessionStorage.getItem(STORAGE_TYPE.rollIn)) || {}
      echo(this.form, this.temp)
      this.getBaseInfo()
      this.getStatus()
      this.getDics()
    },
    beforeRouteLeave(to, fro, next) {
      if (this.canLeave) {
        next(true)
      } else {
        this.$message.confirm('您的业务办理尚未完成，确定离开？').then(() => {
          next(true)
        }).catch(() => {
          next(false)
        })
      }
    }
  }
</script>
<style scoped lang="scss">
  .form{
    margin: .2rem 0 0 0;
  }
</style>
